<template>
	<sysJk :label="'5.防排烟系统工作状态的判断'" showBack :withoutTop="true" :leftTime="360">
		<template v-slot:content>
			<view class="warp" id="warp" @touchmove.stop="()=>{}">
				<view class="taskTit" style="width:100%;text-align: left;font-size: 2.5vh;display: flex;align-items: center;justify-content: space-between;">
					<text>{{questionList[showQuestion-1]}}</text>  
					
					<template v-if="showQuestion==1">
						<image v-if="firstStep==0" :src="requireUrl+'/static/image/jd/j3-1.png'" mode="heightFix" style="height:100%"></image>
						<image v-else-if="firstStep==1" :src="requireUrl+'/static/image/jd/j3-2.png'" mode="heightFix" style="height:100%"></image>
						<image v-else-if="firstStep==2" :src="requireUrl+'/static/image/jd/j3-3.png'" mode="heightFix" style="height:100%"></image>
					</template>
					<template v-if="showQuestion==2">
						<image v-if="secStep==0" :src="requireUrl+'/static/image/jd/j1-1.png'" mode="heightFix" style="height:100%"></image>
						<image v-else-if="secStep==1" :src="requireUrl+'/static/image/jd/j1-2.png'" mode="heightFix" style="height:100%"></image>
						<image v-else-if="secStep==2" :src="requireUrl+'/static/image/jd/j1-3.png'" mode="heightFix" style="height:100%"></image>
						<image v-else-if="secStep==3" :src="requireUrl+'/static/image/jd/j1-4.png'" mode="heightFix" style="height:100%"></image>
					</template>
					<template v-if="showQuestion==5">
						<image v-if="!toolOpen" :src="requireUrl+'/static/image/jd/j2-0.png'" mode="heightFix" style="height:100%"></image>
						<image v-else :src="requireUrl+'/static/image/jd/j2-2.png'" mode="heightFix" style="height:100%"></image>
						
					</template>
				</view>
				<view class="innerContent" style="position:relative;width:100%;height:100%;">
					<image :src="bUrl"  style="width:100%;height:100%;display:block">
					</image>
					<view class="myCard" id="myCard">
						<view class="cardContent">
							<view class="handleBtn">
															<!-- <van-button color="#1E90FF	" custom-style="width:100rpx;height:30rpx;border-radius:10rpx;margin-right:10px" @tap="lastTask">上一题</van-button> -->
															<u-button
																:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'green',color:'#fff',fontSize:'3vh'}" v-if="examType==1" @click="showFlag=true">查看解析</u-button>
															<!-- <van-button color="#1E90FF	" custom-style="width:100rpx;height:30rpx;border-radius:10rpx;margin-right:10px" @tap="nextTask">下一题</van-button> -->
														</view>
														<view class="btnArea">
															<u-button v-if="showQuestion==1&&(firstStep<2)" color="#1E90FF	"
																:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
																@click="nextStep">下一步</u-button>
															<u-button v-else-if="showQuestion==2&&(secStep<3)" color="#1E90FF	"
																:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
																@click="nextStep2">下一步</u-button>
																<u-button v-else-if="showQuestion==5&&!toolOpen" color="#1E90FF	"
																	:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
																	@click="nextStep3">下一步</u-button>
															<u-button color="#1E90FF	"  v-else
																:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
																@click="handle">提交</u-button>
															<u-button color="#1E90FF"
																:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}" @click="redo">重做</u-button>
															<u-button color="#1E90FF" :custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
																@click="goBack">返回</u-button>
														</view>
							<template v-if="showQuestion==1||showQuestion==2">
								<view class="writeBox" :class="result==1?'beSelect':''" v-if="picIndex==1"
									:style="{left:792*widthBl+'px',top:323*heightBl+'px',width:161*widthBl+'px',height:210*heightBl+'px'}"
									@tap="selectThis(1)">
					
								</view>
								<view class="writeBox" :class="result==2?'beSelect':''" v-if="picIndex==1"
									:style="{left:805*widthBl+'px',top:613*heightBl+'px',width:239*widthBl+'px',height:185*heightBl+'px'}"
									@tap="selectThis(2)">
					
								</view>
								<view class="writeBox" :class="result==7?'beSelect':''" v-if="picIndex==1"
									:style="{left:506*widthBl+'px',top:731*heightBl+'px',width:65*widthBl+'px',height:115*heightBl+'px'}"
									@tap="selectThis(7)">
													
								</view>
								<view class="writeBox" :class="result==3?'beSelect':''" v-if="picIndex==4"
									:style="{left:663*widthBl+'px',top:358*heightBl+'px',width:185*widthBl+'px',height:210*heightBl+'px'}"
									@tap="selectThis(3)">
					
								</view>
								<view class="writeBox" :class="result==4?'beSelect':''" v-if="picIndex==4"
									:style="{left:680*widthBl+'px',top:592*heightBl+'px',width:165*widthBl+'px',height:185*heightBl+'px'}"
									@tap="selectThis(4)">
					
								</view>
								<view class="writeBox" :class="result==8?'beSelect':''" v-if="picIndex==4"
									:style="{left:445*widthBl+'px',top:680*heightBl+'px',width:55*widthBl+'px',height:75*heightBl+'px'}"
									@tap="selectThis(8)">
													
								</view>
								<view class="writeBox" :class="result==5?'beSelect':''" v-if="picIndex==3"
									:style="{left:1262*widthBl+'px',top:311*heightBl+'px',width:147*widthBl+'px',height:227*heightBl+'px'}"
									@tap="selectThis(5)">
					
								</view>
								<view class="writeBox" :class="result==6?'beSelect':''" v-if="picIndex==5"
									:style="{left:763*widthBl+'px',top:78*heightBl+'px',width:346*widthBl+'px',height:142*heightBl+'px'}"
									@tap="selectThis(6)">
					
								</view>
								<view class="answerBox">
									<view class="answerTit" v-if="showQuestion==1">
										{{firstQuestionList[firstStep]}}
									</view>
									<view class="answerTit" v-if="showQuestion==2">
										{{secQuestionList[secStep]}}
									</view>
								</view>
							</template>
					
							<template v-if="showQuestion==3">
								<view class="writeBox" v-if="picIndex==6"
									:style="{left:678*widthBl+'px',top:371*heightBl+'px',width:133*widthBl+'px',height:182*heightBl+'px'}"
									@tap="to57">
									<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
										style="width:20px"></image>
								</view>
								<view class="writeBox" v-if="picIndex==7"
									:style="{right:30+'px',top:60+'px',width:50*widthBl+'px',height:50*heightBl+'px'}"
									@tap="back56">
									<image src="https://www.xfzsb.com/static/image/close.png" mode="widthFix"
										style="width:20px"></image>
								</view>
								<view class="answerBox">
									<view class="answerTit">
										判断风机控制柜的工作状态
									</view>
									<view class="answerSelect" style="padding:0">
										<radio-group @change="onChange">
											<label class="uni-list-cell uni-list-cell-pd" v-for="item in items" :key="item"
												style="display: flex;margin-bottom: 5px;align-items: center">
												<view>
													<radio :value="item"  :style="{transform:'scale('+heightBl+')'}"/>
												</view>
												<view>{{item}}</view>
											</label>
										</radio-group>
									</view>
								</view>
							</template>
							<template v-if="showQuestion==4">
					
								<view class="answerBox">
									<view class="answerTit">
										判断排烟防火阀的工作状态
									</view>
									<view class="answerSelect" style="padding:0">
										<radio-group @change="onChange">
											<label class="uni-list-cell uni-list-cell-pd" v-for="item in items2" :key="item"
												style="display: flex;margin-bottom: 5px;align-items: center;">
												<view>
													<radio :value="item" :style="{transform:'scale('+heightBl+')'}"/>
												</view>
												<view>{{item}}</view>
											</label>
										</radio-group>
									</view>
								</view>
							</template>
							<template v-if="showQuestion==5">
								<view class="writeBox" v-if="(picIndex==9||picIndex==12111)&&!isOpen"
									:style="{left:918*widthBl+'px',top:518*heightBl+'px',width:40*widthBl+'px',height:50*heightBl+'px'}"
									@tap="to510">
									<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
										style="width:20px"></image>
								</view>
								<view class="writeBox" v-if="(picIndex==9||picIndex==12111)&&isOpen"
									:style="{left:918*widthBl+'px',top:518*heightBl+'px',width:40*widthBl+'px',height:50*heightBl+'px'}"
									@tap="to511">
									<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
										style="width:20px"></image>
								</view>
								<view class="writeBox" v-if="picIndex==10"
									:style="{left:895*widthBl+'px',top:595*heightBl+'px',width:140*widthBl+'px',height:43*heightBl+'px'}"
									@tap="to511">
									<!-- <image  src="https://www.xfzsb.com/static/image/open.png" mode="widthFix" style="width:20px"></image>					 -->
								</view>
								<view class="writeBox" v-if="picIndex==10||picIndex==11||picIndex==12||picIndex==13||picIndex==14||picIndex==15"
									:style="{right:toolOpen?(720*widthBl+'px') :(30+'px'),top:60+'px',width:50+'px',height:50+'px'}" @tap="back59">
									<image src="https://www.xfzsb.com/static/image/close.png" mode="widthFix"
										style="width:20px"></image>
								</view>
					
								<view class="answerBox" v-if="toolOpen" style="width:25%">
									<view class="answerTit">
										请手动复位排烟口
									</view>
					
								</view>
								<view class="toolBox" v-if="toolOpen"
									:style="{right:0+'px',top:100*heightBl+'px',position:'absolute',padding:'10px',background:'#fff'}">
									<view class="" style="text-align: center;background: orange">
										工具箱
									</view>
									<view class="" style="color:#000">
										<u-grid >
											<u-grid-item :span="8">
												<view :class="waitHandle==1?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(1)">
													<image src="https://www.xfzsb.com/static/image/gw.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
													<p style="font-size: 1.5vh;">感温探测器功能试验器</p>
												</view>
											</u-grid-item>
											<u-grid-item :span="8">
												<view :class="waitHandle==2?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(2)">
													<image src="https://www.xfzsb.com/static/image/gw.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
													<p style="font-size: 1.5vh;">感烟探测器功能试验器</p>
												</view>
											</u-grid-item>
											<u-grid-item :span="8">
												<view :class="waitHandle==3?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(3)">
													<image src="https://www.xfzsb.com/static/image/bs.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
													<p style="font-size: 1.5vh;">六角扳手</p>
												</view>
											</u-grid-item>
											</u-grid>
											<u-grid >
											<u-grid-item :span="8">
												<view :class="waitHandle==4?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(4)">
													<image src="https://www.xfzsb.com/static/image/dh.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
													<p style="font-size: 1.5vh;">消防电话</p>
												</view>
											</u-grid-item>
											<u-grid-item :span="8">
												<view :class="waitHandle==5?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(5)">
													<image src="https://www.xfzsb.com/static/image/zm.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
													<p style="font-size: 1.5vh;"> </p>
												</view>
											</u-grid-item>
											<u-grid-item :span="8">
												<view :class="waitHandle==6?'beSelected':''"
													style="width:100%;text-align:center;box-sizing:border-box"
													@tap="chooseTool(6)">
													<image src="https://www.xfzsb.com/static/image/cf.png"
														mode="heightFix" :style="{height:70*heightBl+'px'}"></image>
														<p style="font-size: 1.5vh;"> </p>
													<!-- <p style="font-size: 8px;">感温探测器功能试验器</p> -->
												</view>
											</u-grid-item>
								
										</u-grid>
									</view>
									<view class="" style="text-align: center;">
										<u-button color="orange" size="mini" @tap="chooseAreaFlag =true">确定</u-button>
									</view>
								</view>
								<template  v-if="chooseAreaFlag&&picIndex==11">
									<view class="writeBox chooseArea" style="border:1px solid red;background:rgba(244,67,54,0.5)"
										:style="{left:920*widthBl+'px',top:460*heightBl+'px',width:80*widthBl+'px',height:80*heightBl+'px',borderRadius:10*widthBl+'px',}"
										@tap="toolFine"
										>
										
									</view>
									<view class="writeBox chooseArea"  style="border:1px solid red;background:rgba(244,67,54,0.5)"
										:style="{left:920*widthBl+'px',top:225*heightBl+'px',width:80*widthBl+'px',height:80*heightBl+'px',borderRadius:10*widthBl+'px',}"
										>
										
									</view>
								</template>
								
								<template v-if="toolshow">
									<view class="writeBox" :style="{left:816*widthBl+'px',top:440*heightBl+'px',width:'50px',height:'50px'}" v-if="picIndex==12" @tap="to12192">
									
									</view>
									<view class="writeBox" :style="{left:925*widthBl+'px',top:225*heightBl+'px',width:'75px',height:'75px'}" v-if="picIndex==13" @tap="to12193">
									
									</view>
									<view class="writeBox" :style="{left:818*widthBl+'px',top:210*heightBl+'px',width:'50px',height:'50px'}" v-if="picIndex==14" @tap="to12194">
									
									</view>
								</template>
							</template>
							
							<view class="areaSelect" v-if="showQuestion==1||showQuestion==2">
								<view class="selectTit">
									场景导航
								</view>
								<view class="selectMain">
									
									<view class="singleSelect" @tap="changeBurl(1)" :class="picIndex==1?'areaBeSelect':''" style="display:flex;font-size:3vh;align-items:center" :style="{height:100*heightBl+'px'}">
										 
										<image :src="url1" mode="heightFix" style="height:100%"></image>
										<text style="margin-left:0.5v">送风机房</text> 
									</view>
									<view class="singleSelect" :class="picIndex==4?'areaBeSelect':''" @tap="changeBurl(4)" style="display:flex;font-size:3vh;align-items:center" :style="{height:100*heightBl+'px'}">
										 
										<image :src="url3" mode="heightFix" style="height:100%"></image>
										<text style="margin-left:0.5v">排烟机房</text> 
									</view>
									<view class="singleSelect" :class="picIndex==3?'areaBeSelect':''" @tap="changeBurl(3)" style="display:flex;font-size:3vh;align-items:center" :style="{height:100*heightBl+'px'}">
										 
										<image :src="url2" mode="heightFix" style="height:100%"></image>
										<text style="margin-left:0.5v">前室</text> 
									</view>
									<view class="singleSelect" :class="picIndex==5?'areaBeSelect':''" @tap="changeBurl(5)" style="display:flex;font-size:3vh;align-items:center" :style="{height:100*heightBl+'px'}">
										 
										<image :src="url4" mode="heightFix" style="height:100%"></image>
										<text style="margin-left:0.5v">房间</text> 
									</view>
									
								</view>
							</view>
						</view>
					</view>
					
					
				</view>
				
				<u-mask :show="showFlag" @click="onClickHide">
					<view class="wrapper" style="display: flex;align-items: center;justify-content: center;height:100%">
						<view class="block" style="width:400rpx;padding: 20rpx;box-sizing:border-box;background: #fff;font-size:2vh">
							<view class="overtitle">
								【试题解析】 正确答案
							</view>
							<view class="overtitle">
								{{analysList[showQuestion-1]}}
							</view>
							<view class="overtitle" v-if="showQuestion==3">
								正确答案：自动状态
							</view>
							<view class="overtitle" v-if="showQuestion==4">
								正确答案：开启状态
							</view>
						</view>
					</view>
				</u-mask>
			</view>

		</template>
	</sysJk>

</template>

<script>
	import sysJk from '@/components/sysJk.vue'
	import {
		fzQuestion
	} from '@/globalApi/requestApi.js'
	const app = getApp();
	const baseUrl = app.globalData.requestUrl;
	export default {
		components: {
			sysJk
		},

		data() {


			return {
				url1:baseUrl + "/static/image/jk/5-1.jpg",
				url2:baseUrl + "/static/image/jk/5-3.jpg",
				url3:baseUrl + "/static/image/jk/5-4.jpg",
				url4:baseUrl + "/static/image/jk/5-5.jpg",
				examType: 1,
				toolshow:false,
				waitHandle: null,
				widthBl: 0,
				heightBl: 0,
				writeBox: {width:0,height:0},
				writeBoxLeft: 0,
				writeBoxTop: 0,
				showFlag: false,
				bUrl: baseUrl + "/static/image/jk/5-1.jpg",
				showQuestion: 1,
				questionList: [
					'【1/5】识别防烟系统组件',
					'【2/5】识别排烟系统组件',
					'【3/5】判断风机控制柜的工作状态',
					'【4/5】判断排烟防火阀当前的工作状态',
					'【5/5】手动开启送风口并进行复位操作',
				],
				result: '',
				picIndex: 1,
				firstStep: 0,
				secStep: 0,
				firstQuestionList: [
					'请识别机械加压送风机',
					'请识别送风口',
					'请识别送风机控制柜'
				],
				secQuestionList: [
					'请识别排烟风机',
					'请识别排烟口',
					'请识别排烟防火阀',
					'请识别排烟风机控制柜'
				],
				items: [
					'自动状态',
					'手动状态'

				],
				items2: [
					'关闭状态',
					'开启状态'
				],
				isOpen: false,
				analysList: [
					'送风口在前室，其他在机房',
					'排烟口在房间，其他在机房',
					'直接看旋转按钮的指向',
					'直接看复位推杆挨着哪边',
					'送风口是拉拉环开启，推杆复位。排烟口是拨火警为开启，用工具，六角扳手来复位，先旋转1是装置复位，再旋转2是装置绞盘是排烟口的板收起来'
				],
				toolOpen: false,
				isCorrect:true,
				returnFine:false,
				chooseAreaFlag:false,
				requireUrl:baseUrl,
				allScore:0
			}
		},
		onLoad(option) {
			this.examType = option.examType
			
		},
		onReady() {
			this.$nextTick(function(){
				this.drawWhiteBox()
			})
		},
		methods: {
			redo(){
				if(this.showQuestion==1||this.showQuestion==2){
						this.result = null
						this.bUr= baseUrl + "/static/image/jk/5-1.jpg"
						this.picIndex=1
				}else if(this.showQuestion==3){
					this.bUrl = baseUrl + "/static/image/jk/5-6.jpg"
					this.picIndex = 6
					this. result = null
				}else if(this.showQuestion==4){
					this.bUrl = baseUrl + "/static/image/jk/5-8.jpg"
					this.picIndex = 8
					this. result = null
				}else {
					if(this.toolOpen){
						this.waitHandle = null
						if(this.isOpen){
							this.bUrl = baseUrl + "/static/image/jk/12-11-1.jpg"
							this.picIndex = 12111
						}else{
							this.bUrl = baseUrl + "/static/image/jk/5-9.jpg"
							this.picIndex = 9
						}
						
					}else{
						this.isOpen = false
						this.bUrl = baseUrl + "/static/image/jk/5-9.jpg"
						this.picIndex = 9
					}
				}
			},
			nextStep3(){
				let that = this
				this.$showModal2({
					title: '确认提交？',
					// content: '这是一个模态弹窗',
					
				}).then(res=>{
					
							that.toolOpen=true
						
				})
			},
			to12194(){
				this.bUrl =  baseUrl + "/static/image/jk/12-19-4.jpg"
				this.picIndex=15
				this.returnFine = true
			},
			to12193(){
				this.bUrl =  baseUrl + "/static/image/jk/12-19-3.jpg"
				this.picIndex=14
			},
			to12192(){
				this.toolshow = true
				this.bUrl =  baseUrl + "/static/image/jk/12-19-2.jpg"
				this.picIndex=13
			},
			
			toolFine() {
				if (this.waitHandle == 3) {
					this.toolshow = true
					this.chooseAreaFlag = false
					this.bUrl =  baseUrl + "/static/image/jk/12-19-1.jpg"
					this.picIndex=12
				}
			},
			chooseTool(num) {
				this.waitHandle = num
			},
			back59() {
				if(this.isOpen&&!this.returnFine){
					this.bUrl = baseUrl + "/static/image/jk/12-11-1.jpg"
					this.picIndex = 12111
					
				}else{
					this.bUrl = baseUrl + "/static/image/jk/5-9.jpg"
					this.picIndex = 9
					this.toolshow = false
					this.toolOpen = false
					
				}
				
			},
			to511() {
				this.bUrl = baseUrl + "/static/image/jk/5-11.jpg"
				this.picIndex = 11
				// this.toolOpen = true
				this.isOpen = true
			},
			to510() {
				if(!this.isOpen){
					this.bUrl = baseUrl + "/static/image/jk/5-10.jpg"
					this.picIndex = 10
				}else{
					this.bUrl = baseUrl + "/static/image/jk/5-11.jpg"
					this.picIndex = 11
				}
				
			},
			back56() {
				this.bUrl = baseUrl + "/static/image/jk/5-6.jpg"
				this.picIndex = 6
			},
			to57() {
				this.bUrl = baseUrl + "/static/image/jk/5-7.jpg"
				this.picIndex = 7
			},
			onChange(e){
				this.result = e.detail.value
			},
			handle() {
				let that = this
				this.$showModal2({
					title: '确认提交？',
					// content: '这是一个模态弹窗',
					
				}).then(res=>{
					
							let handleData = {
								fz_id: that.examId,
								title: '',
								no: '5-'+that.showQuestion,
								question_type: 1,
								user_answer: that.result,
								answer: '',
								is_correct: that.isCorrect,
								score: '',
								start_time: '',
								end_time: '',
								question_answer: ''
							}
							if(that.showQuestion==1){
								if(that.isCorrect&&that.result==1){
									handleData.score = 0.5
									handleData.is_correct=true
								}else{
									handleData.score = 0
									handleData.is_correct=false
								}
								handleData.title = '识别防烟系统组件'
							}else if(that.showQuestion==2){
								if(that.isCorrect&&that.result==3){
									handleData.score = 0.5
									handleData.is_correct=true
								}else{
									handleData.score = 0
									handleData.is_correct=false
								}
								handleData.title = '识别排烟系统组件'
							}else if(that.showQuestion==3){
								if(!that.result){
									uni.showToast({
										title:'请选择答案',
										icon:'none'
									})
									return
								}
								if(that.result=='自动状态'){
									handleData.score = 2
									handleData.is_correct=true
								}else{
									handleData.score = 0
									handleData.is_correct=false
								}
								handleData.title = '判断风机控制柜的工作状态'
							}else if(that.showQuestion==4){
								if(!that.result){
									uni.showToast({
										title:'请选择答案',
										icon:'none'
									})
									return
								}
								if(that.result=='开启状态'){
									handleData.score = 0.5
									handleData.is_correct=true
								}else{
									handleData.score = 0
									handleData.is_correct=false
								}
								handleData.title = '判断排烟防火阀当前的工作状态'
							}
							else if(that.showQuestion==5){
								if(that.returnFine){
									handleData.score = 0.5
									handleData.is_correct=true
								}else{
									handleData.score = 0
									handleData.is_correct=false
								}
								handleData.title = '手动开启送风口并进行复位操作'
							}
							fzQuestion(handleData).then(res => {
								if (res.code == 200) {
									that.result = null
									that.allScore+=handleData.score
									if (that.showQuestion < 5) {
										that.showQuestion += 1
										that.result == ''
										if (that.showQuestion == 3) {
											that.bUrl = baseUrl + "/static/image/jk/5-6.jpg"
											that.picIndex = 6
										}
										if (that.showQuestion == 4) {
											that.bUrl = baseUrl + "/static/image/jk/5-8.jpg"
											that.picIndex = 8
										}
										if (that.showQuestion == 5) {
											that.bUrl = baseUrl + "/static/image/jk/5-9.jpg"
											that.picIndex = 9
										}
										
									} else {
										let pages = getCurrentPages()
										let prevPage = pages[pages.length - 2]
										prevPage.$vm.status5 = true
										prevPage.$vm.addScore(that.allScore)
										uni.navigateBack()
									}
								}
							})
						
				});
			},
			selectThis(data) {
				this.result = data
			},
			nextStep() {
				let that = this
				this.$showModal2({
					title: '确认提交？',
					// content: '这是一个模态弹窗',
					
				}).then(res=>{
					
							let handleData = {
								fz_id: that.examId,
								title: '消防联动控制器直接手动控制单元操作',
								no: '5-1-'+Number(that.firstStep)+1,
								question_type: 1,
								user_answer: that.result,
								answer: '',
								is_correct: '',
								score: 5,
								start_time: '',
								end_time: '',
								question_answer: ''
							}
							if(that.firstStep==0){
								
								if(that.result == 2){
									that.isCorrect = true
									handleData.is_correct = true
								}else{
									that.isCorrect = false
									handleData.is_correct = false
								}
							}else if(that.firstStep==1){
								
								if(that.result == 5&&that.isCorrect){
									that.isCorrect = true
									handleData.is_correct = true
								}else{
									that.isCorrect = false
									handleData.is_correct = false
								}
							}
							fzQuestion(handleData).then(res => {
								if (res.code == 200) {
									that.result = null
									if (that.firstStep < 2) {
										that.firstStep += 1
										// that.bUrl = baseUrl + "/static/image/jk/5-1.jpg"
										// that.picIndex = 1
									}
								}
							})
						
				});
			},

			nextStep2() {
				let that = this
				this.$showModal2({
					title: '确认提交？',
					// content: '这是一个模态弹窗',
					
				}).then(res=>{
					
							let handleData = {
								fz_id: that.examId,
								title: '消防联动控制器直接手动控制单元操作',
								no: '5-2-'+Number(that.secStep),
								question_type: 1,
								user_answer: that.result,
								answer: '',
								is_correct: '',
								score: 5,
								start_time: '',
								end_time: '',
								question_answer: ''
							}
							if(that.secStep==0){
								if(that.result == 4){
									that.isCorrect = true
									handleData.is_correct = true
								}else{
									that.isCorrect = false
									handleData.is_correct = false
								}
							}else if(that.secStep==1){
								if(that.result == 6&&that.isCorrect){
									that.isCorrect = true
									handleData.is_correct = true
								}else{
									that.isCorrect = false
									handleData.is_correct = false
								}
							}else if(that.secStep==2){
								if(that.result == 8&&that.isCorrect){
									that.isCorrect = true
									handleData.is_correct = true
								}else{
									that.isCorrect = false
									handleData.is_correct = false
								}
							}
							fzQuestion(handleData).then(res => {
								if (res.code == 200) {
									that.result = null
									if (that.secStep < 3) {
										that.secStep += 1
										// that.bUrl = baseUrl + "/static/image/jk/5-1.jpg"
										// that.picIndex = 1
									}
								}
							})
						
				});
			},


			goBack() {
				uni.navigateBack()
			},
			changeBurl(num) {

				this.bUrl = baseUrl + "/static/image/jk/5-" + num + ".jpg"
				this.picIndex = num
			},
			showDialog() {
				this.showFlag = true
			},
			onClickHide() {
				this.showFlag = false
			},
			drawWhiteBox() {
				let that = this
				var warp = uni.createSelectorQuery().in(this).select('#myCard')
				warp.boundingClientRect(data => {
					var widthBl = data.width / 1920
					var heightBl = data.height / 921
					this.widthBl = widthBl
					this.heightBl = heightBl
					this.writeBox.width = 100 * widthBl + 'px'
					this.writeBoxLeft = 650 * widthBl + 'px'
					this.writeBoxTop = 420 * heightBl + 'px'
					this.writeBox.height = 100 * heightBl + 'px'
				}).exec()

				// uni.getSystemInfo({
				// 	success: function(res) {
				// 		console.log(res)
				// 		

				// 	}
				// });
			},
			nextTask() {
				uni.navigateTo({
					url: '../jkF/jkF'
				})
			},
			lastTask() {
				uni.navigateBack()
			}
		}
	}
</script>


<style scoped lang="scss">
	.warp {
		height: 100%;
		box-sizing: border-box;
		// padding: 22rpx 33rpx 38rpx 36rpx;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background: #F6F6F6;

		.answerBox {
			position: absolute;
			left: 50px;
			top: 0%;
			background: #fff;
			color: #000;
			width: 20%;
			font-size: 2vh;
			.answerTit {
				background: orange
			}
		}

		.answerSelect {
			padding: 10px 0;
			box-sizing: border-box;
		}

		.myCard {
			width: 100%;
			height:100%;
			position: absolute;
			// border-radius: 20rpx;
			// overflow: hidden;
			left:0;
			top:0;

			.cardContent {
				// padding: 52rpx 58rpx 37rpx;
				box-sizing: border-box;
				width: 100%;
				height: 100%;
				position: relative;
				// z-index: 2;
				color: #fff;

				.moneyContent {
					margin-top: 54rpx;
					width: 100%;
					display: flex;
					align-items: center;

					.moneyDetail {
						width: 50%;
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: flex-start;

						.detailTit {
							font-size: 24rpx;
							font-weight: 400;
						}

						.detailVal {
							font-size: 55rpx;
							font-weight: bold;
							margin-top: 35rpx;
						}
					}

				}

				.taskTit {
					width: 100%;
					text-align: left;
					background: #fff;
					color: #000
				}

				.handleBtn {
					position: fixed;
					left: 30px;
					bottom: 0px
				}

				.btnArea {
					margin-top: 160rpx;
					//margin-left: 150rpx;
					display: flex;
					justify-content: center;
					position: fixed;
					right: 30px;
					bottom: 0px // text-align: center;
				}
			}
		}

		.infoBox {
			width: 100%;
			padding: 14rpx 30rpx;
			margin-top: 33rpx;
			border-radius: 20rpx;
			box-sizing: border-box;
			background: #fff;

			.singleInfo {
				width: 100%;
				box-sizing: border-box;
				padding: 20rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid #ccc;

				.info {
					flex: 1;

					.desc {
						font-size: 26rpx;
						font-weight: 400;
						color: #222222;
					}

					.time {
						margin-top: 15rpx;
						font-size: 18rpx;
						font-weight: 400;
						color: #888888;
						display: flex;
						align-items: center;
					}
				}

				.val {
					width: 115rpx;
					height: 40rpx;
					border: 1rpx solid #DA2627;
					border-radius: 40rpx;
					text-align: center;
					font-size: 22rpx;
					font-weight: 400;
					color: #DA2627;
					line-height: 40rpx;
				}
			}
		}

		.writeBox {
			// border: 1px solid green;
			width: 100px;
			height: 100px;
			position: absolute;
			display: flex;
			align-items: center;
		}

		.areaSelect {
			position: absolute;
			right: 0;
			bottom: 40%;
			color: #000;

			.selectTit {
				background: orange;
				padding: 5px;
				box-sizing: border-box;
				text-align: center;
			}

			.selectMain {
				background: #fff;

				.singleSelect {
					padding: 5px;
					box-sizing: border-box;
					text-align: center;
				}
			}
		}

		.beSelect {
			background: rgba(68, 133, 234, 0.5)
		}

		.beSelected {
			border: 1px solid red
		}
		.areaBeSelect{
			border: 1px solid red
		}
	}
</style>